<template>
	<view class="content">
		<!-- 首页轮播图 -->
		<Banner :dataList="BannerData"></Banner>
		<template>
			<!-- 商品分类 -->
			<Food :dataList='listData'></Food>
			<Card cardTitle="促销商品"></Card>
		</template>
		
		<!-- 热销商品 -->
		<template>
			<CommodityList :dataList="DiscountData" cardTitle="discountgoods"></CommodityList>
			<Card cardTitle="热销商品"></Card>
		</template>
		
		<!-- 猜你喜欢 -->
		<template>
			<CommodityList :dataList="HotData" cardTitle="hotgoods"></CommodityList>
			<Card cardTitle="猜你喜欢"></Card>
		</template>
		<CommodityList :dataList="RecommendData" cardTitle="recommendgoods"></CommodityList>
		<Tabbar cureentPage="index"></Tabbar>
	</view>
</template>

<script>
	import $http from '@/common/api/request.js'
	import Banner from "../../components/index/Banner.vue"
	import Food from "../../components/index/Food.vue"
	import Card from "../../components/common/Card.vue"
	import CommodityList from "../../components/common/CommodityList.vue"
	import Tabbar from '../../components/common/TabBar.vue'
	export default {
		data() {
			return {
				title: 'Hello',
				// 搜索词
				searchText:'',
				// 促销商品数据
				DiscountData:[],
				// 热销商品数据
				HotData:[],
				// 猜你喜欢商品
				RecommendData:[],
				// 轮播图图片
				BannerData:[],
				// 分类列表图片
				listData:[]
			}
		},
		components:{
			Banner,
			Food,
			Card,
			CommodityList,
			Tabbar
		},
		onLoad() {
			this.DiscountGoodsData()
			this.HotGoodsData()
			this.RecommendGoodsData()
			this.getBannerData()
			this.getListData()
		},
		// 监听原生标题栏输入框点击事件
		onNavigationBarSearchInputClicked(e){
			uni.navigateTo({
				url:"/pages/search/search"
			})
		},
		methods: {
			// 请求轮播图
			getBannerData(){
				$http.request({
					url:"/index/BannerData"
				}).then((res)=>{
					this.BannerData = res
				}).catch(()=>{
					uni.showToast({
						title:"请求失败",
						icon:"none"
					})
				})
			},
			// 请分类列表
			getListData(){
				$http.request({
					url:"/list/getListData"
				}).then((res)=>{
					this.listData = res
				}).catch(()=>{
					uni.showToast({
						title:"请求失败",
						icon:"none"
					})
				})
			},
			//请求促销商品数据
			DiscountGoodsData(){
				$http.request({
					url:"/home/getDiscountGoods"
				}).then((res)=>{
					this.DiscountData = res.data
				}).catch(()=>{
					uni.showToast({
						title:"请求失败",
						icon:"none"
					})
				})
			},
			// 请求热销商品数据
			HotGoodsData(){
				$http.request({
					url:"/home/getHotGoods"
				}).then((res)=>{
					this.HotData = res.data
				}).catch(()=>{
					uni.showToast({
						title:"请求失败",
						icon:"none"
					})
				})
			},
			// 请求猜你喜欢数据---推荐
			RecommendGoodsData(){
				$http.request({
					url:"/home/getRecommendGoods"
				}).then((res)=>{
					this.RecommendData = res.data
				}).catch(()=>{
					uni.showToast({
						title:"请求失败",
						icon:"none"
					})
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
